@use '@/styles/mixins/function.scss' as *;
@use './variable.scss' as *;
// ----- 表格扩展自定义样式
.rk-grid {
	@include b('grid') {
		.fn-inline {
			display: inline-block;
			font-style: normal;
			vertical-align: middle;
		}
		// &-header-cell {
		//   color: #606266;
		//   background-color: #DCE4FB;
		// }
	}
	@include b('grid-toolbar') {
		align-items: center;
		background: #fff;
		display: flex;
		height: 100%;
		&-title {
			display: flex;
			font-size: 0;
			&__span {
				// background: #dce4fb;
				// color: #2e3133;
				color: var(--next-bg-tableBarColor);
				font-size: 16px;
				height: 32px;
				line-height: 32px;
				padding: 0 16px;
				position: relative;
				text-align: left;
			}
			&__i {
				border: 16px solid transparent;
				// border-left: 20px solid #dce4fb;
				height: 1px;
				width: 1px;
			}
		}
		&-left {
			align-items: center;
			display: flex;
			flex-wrap: wrap;
		}
		&-right {
			align-items: center;
			display: flex;
			flex: 1;
			justify-content: flex-end;
			.toolbar-right-slot {
				align-items: center;
				display: flex;
				// flex-wrap: wrap;
				justify-content: right;
				margin-right: 12px;
			}
			.toolbar-right-button {
				display: flex;
				flex-direction: row-reverse;
			}
		}
		// .vxe-tools--wrapper {
		//   margin-right: 12px;
		// }
	}
}

// ----- 表格复选框样式
.rk-grid {
	.vxe-table--filter-option .vxe-checkbox--icon,
	.vxe-export--panel-column-option .vxe-checkbox--icon,
	.vxe-table--render-default .vxe-cell--checkbox .vxe-checkbox--icon,
	.vxe-custom--option .vxe-checkbox--icon,
	.vxe-checkbox .vxe-checkbox--icon {
		color: $common_border_color;
	}
	.is--checked.vxe-table--filter-option .vxe-checkbox--icon,
	.is--checked.vxe-export--panel-column-option .vxe-checkbox--icon,
	.vxe-table--render-default .is--checked.vxe-cell--checkbox .vxe-checkbox--icon,
	.is--checked.vxe-custom--option .vxe-checkbox--icon,
	.is--checked.vxe-checkbox .vxe-checkbox--icon,
	.is--indeterminate.vxe-table--filter-option .vxe-checkbox--icon,
	.is--indeterminate.vxe-export--panel-column-option .vxe-checkbox--icon,
	.vxe-table--render-default .is--indeterminate.vxe-cell--checkbox .vxe-checkbox--icon,
	.is--indeterminate.vxe-custom--option .vxe-checkbox--icon,
	.is--indeterminate.vxe-checkbox .vxe-checkbox--icon {
		// color: #409eff;
		color: var(--el-color-primary) !important;
	}
}
// ----- 表格行
.rk-grid {
	.vxe-table--render-default {
		.vxe-body--row.row--hover,.vxe-body--row.row--current {
			// background-color: $common_table_row_hover_color;
			background-color: var(--el-color-primary-light-9);
			&.row--stripe {
				// background-color: $common_table_row_hover_color;
				background-color: var(--el-color-primary-light-9);
			}
		}
	}
}

// ----- vxe-pager自定义样式
.rk-grid {
	.vxe-pager {
		.vxe-pager--wrapper {
			.vxe-select {
				.is--active {
					color: var(--el-color-primary) !important;
				}
			}
		}
		.vxe-select-option--wrapper {
			&:focus,
			.is--selected {
				color: var(--el-color-primary) !important;
			}
		}
		.vxe-pager--goto,
		.vxe-pager--sizes {
			&:not(.is--disabled) {
				&:focus,
				&.is--active {
					border-color: var(--el-color-primary) !important;
				}
			}
		}
		.vxe-pager--jump-next,
		.vxe-pager--jump-prev,
		.vxe-pager--next-btn,
		.vxe-pager--num-btn,
		.vxe-pager--prev-btn {
			&:not(.is--disabled) {
				&:focus,
				&.is--active {
					color: #fff;
					// background-color: #4f78e4;
					background-color: var(--el-color-primary) !important;
					border-color: var(--el-color-primary) !important;
				}
			}
		}
		&.is--background {
			.vxe-pager--num-btn {
				&:not(.is--disabled) {
					&.is--active {
						&:hover {
							background-color: var(--next-bg-tableBarActiveColor);
							// background-color: $common_table_page_active_color;
						}
					}
				}
			}
		}
	}
}
// 工具栏操作
.rk-grid {
	.vxe-toolbar .vxe-tools--operate {
		padding-right: 8px;
	}
}
.rk-grid {
	.vxe-table--render-default .vxe-table--fixed-left-wrapper,
	.vxe-table--render-default .vxe-table--fixed-right-wrapper {
		z-index: 3;
	}
}
